<!-- Fitxer Login -->
<!DOCTYPE html>
<html>
	<head>
		<title>SUBE</title>
		<link rel="stylesheet" href="css/theme.css">
		<style type="text/css">
			.slideshow { height: 450px; width: 632px; margin: auto }
			.slideshow img { padding: 3px; border: 1px solid #ccc; background-color: black; border-color:black }
		</style>
		<!-- include jQuery library -->
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
		<script>
		function prueba(){
			$(document).ready(function() {
			                //Getting the variable's value from a link 
					var loginBox = '#login-box';

					//Fade in the Popup
					$(loginBox).fadeIn(300);
					
					//Set the center alignment padding + border see css style
					var popMargTop = ($(loginBox).height() + 24) / 2; 
					var popMargLeft = ($(loginBox).width() + 24) / 2; 
					
					$(loginBox).css({ 
						'margin-top' : -popMargTop,
						'margin-left' : -popMargLeft
					});
					
					// Add the mask to body
					$('body').append('<div id="mask"></div>');
					$('#mask').fadeIn(300);
					
					return false;
				});
				
				// When clicking on the button close or the mask layer the popup closed
				$('a.close, #mask').live('click', function() { 
				  $('#mask , .login-popup').fadeOut(300 , function() {
					$('#mask').remove();  
				}); 
				return false;
			});
		};
		</script>
	</head>
	<body>
		<?php
			if (isset($_GET['login'])){
				if($_GET['login'] == 1){
					echo '<script>prueba()</script>';
				}
			}
		?>
		<div id="login-box" class="login-popup">
	        <a href="#" class="close"><img src="img/close_pop.png" class="btn_close" title="Cerrar" alt="Cerrar" align="right"/></a>
	          <form method="post" class="signin" action="#">
	                <fieldset class="textbox">
	            	<label class="username">
	                <span>Usuario</span>
	                <input id="username" name="username" value="" type="text" autocomplete="on" placeholder="Username">
	                </label>
	                <label class="password">
	                <span>Password</span>
	                <input id="password" name="password" value="" type="password" placeholder="Password">
	                </label>
	                <button class="submit button" type="button">Login</button>
	                <p>
	                <a class="forgot" href="#">Recuperar Password</a>
	                </p>        
	                </fieldset>
	          </form>
		</div>
	</body>
</html>